<template>
    <div>
        <h3>房号添加</h3>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td>房型</td>
                    <td>
                       <select v-model="addno.houseTypeId">
                        <option value="">请选择</option>
                        <option :value="item.id" v-for="item in query.list">{{ item.houseName }}</option>
                       </select>
                    </td>
                </tr>
                <tr>
                    <td>房间号码</td>
                    <td>
                        <input type="text" v-model="addno.houseNoName">
                    </td>
                </tr>
                <tr>
                    <td>房间描述</td>
                    <td>
                        <textarea cols="50" rows="5"  v-model="addno.desc"></textarea>
                    </td>
                </tr>
               
                <tr>
                    <td>状态</td>
                    <td>
                       <input type="radio" name="state" value="1"  v-model="addno.state">上架
                       <input type="radio" name="state" value="0"  v-model="addno.state">下架
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="保存" class="btn btn-primary" @click="ok">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import {ref,reactive,onMounted} from 'vue'
import {useRoute,useRouter} from 'vue-router'
const Route=useRoute();
const Router=useRouter();

onMounted(()=>{
    getlist();
})

const addno=reactive({
  
  "houseTypeId": '',
  "houseNoName": "",
  "desc": "",
  "state": '',
})
const ok=()=>{
    if(addno.houseTypeId==""){
        alert("房型不能为空");
        return;
    }
    if(addno.houseNoName==""){
        alert("房间号码不能为空");
        return;
    }
    if(addno.desc==""){
        alert("房间描述不能为空");
        return;
    }
    axios({
        method:'post',
        url:'/api/HouseNo/HouseNoAdd',
        data:addno,
    })
    .then(res=>{
        console.log(res);
        if(res.data>0){
            alert("添加成功");
            Router.push('/houseNoShow');
     
        }
        else{
            alert("添加失败");
            return;
        }       
    })
    .catch(err=>{
        console.log(err);
    })
}

const query:any=reactive({
    totalCount:0,
    totalPage:0,
    list:[],
})
const getlist=()=>{
    axios({
        method:'get',
        url:'/api/HouseType/HouseTypeShows',
        params:{
            pagesize:100,
        }
    })
    .then(res=>{
        console.log(res);
        query.list=res.data.list
        query.totalCount=res.data.totalCount
        query.totalPage=res.data.totalPage
       
    })
    .catch(err=>{
        console.log(err);
    })
}
</script>

<style scoped>

</style>